<script setup lang='ts'>
import type { VxePagerEvents } from 'vxe-table'

import { useAuditLogPage } from '@fl/api/man-api'
import { SearchTable } from '@fl/components'
import { ElButton, ElCard } from 'element-plus'
import { useRoute, useRouter } from 'vue-router'

const { back } = useRouter()

const { params } = useRoute()

const unifiedSocialCreditCode = computed(() => {
    return params.id
})

const gridOptions = reactive({
    columns: [
        { field: 'accountName', title: '账号名称' },
        { field: 'enterpriseSubtypeName', title: '账号子类型' },
        { field: 'authenticatorPhone', title: '认证人电话' },
        { field: 'certifiedPerson', title: '认证人' },
        { field: 'createTime', title: '提交时间' },
        { field: 'auditTime', title: '审核时间' },
        { field: 'companyName', title: '公司名称' },
        { field: 'auditBy', title: '审核人员' },
        { field: 'auditStatusName', title: '审核结果' },
    ],
    showOverflow: false,
})

const tablePage = ref({
    currentPage: 1,
    pageSize: 10,
    total: 0,
})

const searchParams = computed(() => {
    return {
        enterpriseNo: '',
        page: tablePage.value.currentPage,
        size: tablePage.value.pageSize,
        unifiedSocialCreditCode: unifiedSocialCreditCode.value,
    }
})

const { data, isLoading } = useAuditLogPage(searchParams)

function goBack() {
    back()
}

const handlePageChange: VxePagerEvents.PageChange = ({ currentPage, pageSize }) => {
    tablePage.value.currentPage = currentPage
    tablePage.value.pageSize = pageSize
}

watchEffect(() => {
    if (data.value) {
        tablePage.value.total = data.value?.total ?? 0
    }
})
</script>

<template>
    <ElCard shadow="never">
        <div class="mb-20 text-16 font-700">
            审核记录
        </div>

        <SearchTable v-bind="gridOptions"
                     v-model:pager="tablePage"
                     :loading="isLoading"
                     :data="data?.records"
                     @page-change="handlePageChange"
        />

        <div class="flex justify-center">
            <ElButton @click="goBack">
                返回
            </ElButton>
        </div>
    </ElCard>
</template>
